<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Портфолио Студента</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" />
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
    <link href="{{ url_for('static', filename='css/bootstrap-utilities.css') }}" rel="stylesheet" />
    <link rel="stylesheet" href="{{ url_for('static', filename='css/index-css.css') }}" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
  </head>
  <body>
    <div class="container mt-5">
      <nav class="navbar navbar-expand-lg navbar-light fixed-top bg-light">
        <div class="container-fluid">
          <a class="navbar-brand">Студпортфолио</a>
          <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
          <div class="collapse navbar-collapse" id="navbarNav">
            <ul class="navbar-nav ms-auto">
              <li class="nav-item">
                <a class="nav-link active" aria-current="page" href="{{ url_for('auth.index') }}">
                  <i class="bi bi-house-door"></i> Главная
                </a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">
                  <i class="bi bi-newspaper"></i> Новости
                </a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">
                  <i class="bi bi-info-circle"></i> О нас
                </a>
              </li>
              {% if current_user.is_authenticated %}
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                  <img src="{{ current_user.avatar_url() }}" alt="Avatar" class="rounded-circle" width="30" height="30">
                  {{ current_user.nickname() }}
                </a>
                <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
                  <li>
                    {% if current_user.role == RoleEnum.STUDENT %}
                      <a class="dropdown-item" href="{{ url_for('auth.student_profile', username=current_user.student.username) }}">Профиль</a>
                    {% elif current_user.role == RoleEnum.EMPLOYER %}
                      <a class="dropdown-item" href="{{ url_for('auth.employer_profile', company_name=current_user.employer.company_name) }}">Профиль</a>
                    {% endif %}
                  </li>
                  <li><a class="dropdown-item" href="{{ url_for('auth.settings') }}">Настройки</a></li>
                  <li><hr class="dropdown-divider"></li>
                  <li><a class="dropdown-item" href="{{ url_for('auth.logout') }}">Выйти</a></li>
                </ul>
              </li>
              {% else %}
              <li class="nav-item">
                <a class="nav-link" href="#" data-bs-toggle="modal" data-bs-target="#userTypeModal">
                  <i class="bi bi-box-arrow-in-right"></i> Войти
                </a>
              </li>
              {% endif %}
            </ul>
          </div>
        </div>
      </nav>

      <!-- Общее модальное окно для выбора типа пользователя -->
      <div class="modal fade" id="userTypeModal" tabindex="-1" aria-labelledby="userTypeModalLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
        <div class="modal-dialog modal-dialog-centered">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title text-primary" id="userTypeModalLabel">
                <i class="bi bi-person-badge"></i> Выберите тип пользователя
              </h5>
              <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
              <div class="d-grid gap-3">
                <button type="button" class="btn btn-info btn-lg" data-bs-toggle="modal" data-bs-target="#registerModalEmployer" data-bs-dismiss="modal">
                  <i class="bi bi-briefcase me-2"></i>Работодатель
                </button>
                <button type="button" class="btn btn-dark btn-lg" data-bs-toggle="modal" data-bs-target="#registerModalStudent" data-bs-dismiss="modal">
                  <i class="bi bi-person me-2"></i>Студент
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Модальное окно для регистрации студента -->
      <div class="modal fade" id="registerModalStudent" tabindex="-1" aria-labelledby="registerModalStudentLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
        <div class="modal-dialog modal-dialog-centered">
          <div class="modal-content">
            <div class="modal-header bg-dark text-white">
              <h5 class="modal-title" id="registerModalStudentLabel">
                <i class="bi bi-person-plus"></i> Регистрация студента
              </h5>
              <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body bg-white text-dark">
              <form method="POST" action="{{ url_for('auth.register_student') }}">
                {{ student_form.hidden_tag() }}
                <div class="mb-3">
                  <label class="form-label" for="first_name">
                    <i class="bi bi-person"></i> {{ student_form.first_name.label.text }}
                  </label>
                  {{ student_form.first_name(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="last_name">
                    <i class="bi bi-person"></i> {{ student_form.last_name.label.text }}
                  </label>
                  {{ student_form.last_name(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="middle_name">
                    <i class="bi bi-person"></i> {{ student_form.middle_name.label.text }}
                  </label>
                  {{ student_form.middle_name(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="email">
                    <i class="bi bi-envelope"></i> {{ student_form.email.label.text }}
                  </label>
                  {{ student_form.email(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="phone">
                    <i class="bi bi-telephone"></i> {{ student_form.phone.label.text }}
                  </label>
                  {{ student_form.phone(class="form-control", placeholder="+7 (___)-___-__-__") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="username">
                    <i class="bi bi-person-circle"></i> {{ student_form.username.label.text }}
                  </label>
                  {{ student_form.username(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="password">
                    <i class="bi bi-lock"></i> {{ student_form.password.label.text }}
                  </label>
                  <div class="input-group mb-3">
                    {{ student_form.password(class="form-control", id="password_student") }}
                    <button class="btn btn-outline-secondary toggle-password" type="button" data-target="password_student">
                      <i class="bi bi-eye"></i>
                    </button>
                  </div>
                </div>
                <div class="mb-3">
                  <label class="form-label" for="confirm_password">
                    <i class="bi bi-lock-fill"></i> {{ student_form.confirm_password.label.text }}
                  </label>
                  <div class="input-group mb-3">
                    {{ student_form.confirm_password(class="form-control", id="confirm_password_student") }}
                    <button class="btn btn-outline-secondary toggle-password" type="button" data-target="confirm_password_student">
                      <i class="bi bi-eye"></i>
                    </button>
                  </div>
                </div>
                <div class="d-grid gap-2">
                  {{ student_form.submit(class="btn btn-dark btn-lg") }}
                </div>
              </form>
              <div class="text-center mt-3">
                <a href="#" class="btn btn-outline-primary" data-bs-toggle="modal" data-bs-target="#loginModalStudent" data-bs-dismiss="modal">
                  <i class="bi bi-box-arrow-in-right"></i> Есть аккаунт? Войти
                </a>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Модальное окно для регистрации работодателя -->
      <div class="modal fade" id="registerModalEmployer" tabindex="-1" aria-labelledby="registerModalEmployerLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
        <div class="modal-dialog modal-dialog-centered">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title text-primary" id="registerModalEmployerLabel">
                <i class="bi bi-person-plus"></i> Регистрация работодателя
              </h5>
              <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
              <form method="POST" action="{{ url_for('auth.register_employer') }}">
                {{ employer_form.hidden_tag() }}
                <div class="mb-3">
                  <label class="form-label" for="company_name">
                    <i class="bi bi-building"></i> {{ employer_form.company_name.label.text }}
                  </label>
                  {{ employer_form.company_name(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="email">
                    <i class="bi bi-envelope"></i> {{ employer_form.email.label.text }}
                  </label>
                  {{ employer_form.email(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="phone">
                    <i class="bi bi-telephone"></i> {{ employer_form.phone.label.text }}
                  </label>
                  {{ employer_form.phone(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="password">
                    <i class="bi bi-lock"></i> {{ employer_form.password.label.text }}
                  </label>
                  <div class="input-group mb-3">
                    {{ employer_form.password(class="form-control", id="password_employer") }}
                    <button class="btn btn-outline-secondary toggle-password" type="button" data-target="password_employer">
                      <i class="bi bi-eye"></i>
                    </button>
                  </div>
                </div>
                <div class="mb-3">
                  <label class="form-label" for="confirm_password">
                    <i class="bi bi-lock-fill"></i> {{ employer_form.confirm_password.label.text }}
                  </label>
                  <div class="input-group mb-3">
                    {{ employer_form.confirm_password(class="form-control", id="confirm_password_employer") }}
                    <button class="btn btn-outline-secondary toggle-password" type="button" data-target="confirm_password_employer">
                      <i class="bi bi-eye"></i>
                    </button>
                  </div>
                </div>
                <div class="d-grid gap-2">
                  {{ employer_form.submit(class="btn btn-primary btn-lg text-white bg-primary border-primary") }}
                </div>
              </form>
              <div class="text-center mt-3">
                <a href="#" data-bs-toggle="modal" data-bs-target="#loginModalEmployer" data-bs-dismiss="modal">
                  <i class="bi bi-box-arrow-in-right"></i> Есть аккаунт? Войти
                </a>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Модальное окно для входа студента -->
      <div class="modal fade" id="loginModalStudent" tabindex="-1" aria-labelledby="loginModalStudentLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
        <div class="modal-dialog modal-dialog-centered">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title text-primary" id="loginModalStudentLabel">
                <i class="bi bi-box-arrow-in-right"></i> Вход для студента
              </h5>
              <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
              <form method="POST" action="{{ url_for('auth.login') }}">
                {{ login_form.hidden_tag() }}
                <div class="mb-3">
                  <label class="form-label" for="email">
                    <i class="bi bi-envelope"></i> {{ login_form.email.label.text }}
                  </label>
                  {{ login_form.email(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="password">
                    <i class="bi bi-lock"></i> {{ login_form.password.label.text }}
                  </label>
                  <div class="input-group mb-3">
                    {{ login_form.password(class="form-control", id="password_login_student") }}
                    <button class="btn btn-outline-secondary toggle-password" type="button" data-target="password_login_student">
                      <i class="bi bi-eye"></i>
                    </button>
                  </div>
                </div>
                <div class="mb-3 form-check">
                  {{ login_form.remember(class="form-check-input") }}
                  <label class="form-check-label" for="remember">{{ login_form.remember.label.text }}</label>
                </div>
                <div class="d-grid gap-2">
                  {{ login_form.submit(class="btn btn-primary btn-lg text-primary bg-white border-primary") }}
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>

      <!-- Модальное окно для входа работодателя -->
      <div class="modal fade" id="loginModalEmployer" tabindex="-1" aria-labelledby="loginModalEmployerLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
        <div class="modal-dialog modal-dialog-centered">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title text-primary" id="loginModalEmployerLabel">
                <i class="bi bi-box-arrow-in-right"></i> Вход для работодателя
              </h5>
              <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
              <form method="POST" action="{{ url_for('auth.login') }}">
                {{ login_form.hidden_tag() }}
                <div class="mb-3">
                  <label class="form-label" for="email">
                    <i class="bi bi-envelope"></i> {{ login_form.email.label.text }}
                  </label>
                  {{ login_form.email(class="form-control") }}
                </div>
                <div class="mb-3">
                  <label class="form-label" for="password">
                    <i class="bi bi-lock"></i> {{ login_form.password.label.text }}
                  </label>
                  <div class="input-group mb-3">
                    {{ login_form.password(class="form-control", id="password_login_employer") }}
                    <button class="btn btn-outline-secondary toggle-password" type="button" data-target="password_login_employer">
                      <i class="bi bi-eye"></i>
                    </button>
                  </div>
                </div>
                <div class="mb-3 form-check">
                  {{ login_form.remember(class="form-check-input") }}
                  <label class="form-check-label" for="remember">{{ login_form.remember.label.text }}</label>
                </div>
                <div class="d-grid gap-2">
                  {{ login_form.submit(class="btn btn-primary btn-lg text-primary bg-white border-primary") }}
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>

      {% block content %}{% endblock %}

      <footer class="footer mt-auto w-100">
        <div class="container">
          <div class="row py-3">
            <div class="col-md-6">
              <h6>Разделы</h6>
              <ul class="list-unstyled">
                <li>
                  <a href="#" class="text-decoration-none text-dark">
                    <i class="bi bi-house-door"></i> Главная
                  </a>
                </li>
                <li>
                  <a href="#" class="text-decoration-none text-dark">
                    <i class="bi bi-lightbulb"></i> Возможности
                  </a>
                </li>
                <li>
                  <a href="#" class="text-decoration-none text-dark">
                    <i class="bi bi-currency-dollar"></i> Цены
                  </a>
                </li>
                <li>
                  <a href="#" class="text-decoration-none text-dark">
                    <i class="bi bi-question-circle"></i> FAQ
                  </a>
                </li>
                <li>
                  <a href="#" class="text-decoration-none text-dark">
                    <i class="bi bi-info-circle"></i> О нас
                  </a>
                </li>
              </ul>
            </div>
            <div class="col-md-6">
              <h6>Подписка на новости</h6>
              <form>
                <div class="input-group mb-3">
                  <input type="email" class="form-control" placeholder="Ваш email">
                  <button class="btn btn-outline-dark" type="submit">
                    <i class="bi bi-envelope"></i> Подписаться
                  </button>
                </div>
              </form>
            </div>
          </div>
          <div class="row border-top pt-3">
            <div class="col-md-6">
              <p>© 2024 Company, Inc. Все права защищены.</p>
            </div>
            <div class="col-md-6 text-end">
              <a href="https://t.me/belkaratarosk" class="text-dark me-3" target="_blank">
                <i class="bi bi-telegram fs-4"></i>
              </a>
              <a href="https://github.com/pradigmaz/studporfolio" class="text-dark" target="_blank">
                <i class="bi bi-github fs-4"></i>
              </a>
            </div>
          </div>
        </div>
      </footer>
    </div>

    <script src="{{ url_for('static', filename='js/main-js.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
    <script src="{{ url_for('static', filename='js/popover.js') }}"></script>
  </body>
</html>
